<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:p="http://primefaces.org/ui">

    <ui:composition>

        <p:dialog id="PagosCreateDlg" widgetVar="PagosCreateDialog" modal="true" resizable="false" appendTo="@(body)" header="CREAR">
            <h:form id="PagosCreateForm">
                <h:panelGroup id="display">
                    <p:panelGrid columns="2" rendered="#{pagosController.selected != null}">
                        <p:outputLabel value="FECHA DE REGISTRO" for="fechaRegistro" />
                        <p:calendar id="fechaRegistro" pattern="MM/dd/yyyy HH:mm:ss" 
                                    value="#{pagosController.selected.fechaRegistro}" 
                                    title="fecha de registro" 
                                    required="true" 
                                    requiredMessage="fecha de registro requerida" showOn="button">
                        </p:calendar>

                        <p:outputLabel value="FECHA DE CADUCIDAD" for="fechaCaducidad" />
                        <p:calendar id="fechaCaducidad" pattern="MM/dd/yyyy" 
                                    value="#{pagosController.selected.fechaCaducidad}" 
                                    title="fecha de caducidad"  showOn="button"
                                    required="true">
                        </p:calendar>

                        <p:outputLabel value="NUMERO DE DEPOSITO" for="numeroDeposito" />
                        <p:inputText id="numeroDeposito" 
                                     value="#{pagosController.selected.numeroDeposito}" 
                                     title="numero de deposito" />

                        <p:outputLabel value="FECHA DE DEPOSITO" for="fechaDeposito" />
                        <p:calendar id="fechaDeposito" pattern="MM/dd/yyyy" 
                                    value="#{pagosController.selected.fechaDeposito}" 
                                    title="fecha de deposito"  showOn="button"/>

                        <p:outputLabel value="VALOR DEPOSITADO" for="valor" />
                        <p:inputText id="valor"
                                     value="#{pagosController.selected.valor}" 
                                     title="valor depositado" />
                    </p:panelGrid>

                    <p:panel id="panelUsuario">
                        <h:panelGrid columns="2" style="width:100%;">
                            <p:outputLabel value="USUARIO" />
                            <p:inputText placeholder="Buscar Por Identificacion" value="#{pagosController.identidad}">
                                <p:ajax event="blur"  listener="#{pagosController.buscarUsuario()}"  update="panelUsuario"/>
                            </p:inputText>
                        </h:panelGrid>
                        <h:panelGrid columns="2"  rendered="#{pagosController.usuario!=null}">
                            <f:facet name="header">
                                <p:graphicImage value="Documentos/#{pagosController.usuario.username}/#{pagosController.usuario.url}" width="60" height="60"/> 
                            </f:facet>
                            <h:outputText value="NOMBRES:" style="font-weight: bold; color: #0480be"/>
                            <h:outputText value="#{pagosController.usuario.nombres} #{pagosController.usuario.apellidos}"/>
                            <h:outputText value="IDENTIFICACION:" style="font-weight: bold; color: #0480be"/>
                            <h:outputText value="#{pagosController.usuario.identidad}"/>
                            <h:outputText value="EMAIL:" style="font-weight: bold; color: #0480be"/>
                            <h:outputText value="#{pagosController.usuario.correoElectronico}"/>
                            <h:outputText value="ESTADO:" style="font-weight: bold; color: #0480be"/>
                            <p:selectOneMenu id="estado" 
                                             value="#{pagosController.usuario.sistemaUsuario.estado}">
                                <f:selectItem itemLabel="PAGADO" itemValue="P" />  
                                <f:selectItem itemLabel="VENCIDO" itemValue="V" />
                                <f:selectItem itemLabel="EN ESPERA" itemValue="E" />  
                            </p:selectOneMenu>
                        </h:panelGrid>
                        <p:commandButton actionListener="#{pagosController.saveNew}" 
                                         value="#{bundle.Save}" 
                                         rendered="#{pagosController.usuario!=null}"
                                         update="display,:PagosListForm:datalist,:growl" 
                                         oncomplete="handleSubmit(args, 'PagosCreateDialog');"/>
                    </p:panel>
                    <p:commandButton value="#{bundle.Cancel}" onclick="PagosCreateDialog.hide()"/>
                </h:panelGroup>
            </h:form>
        </p:dialog>

    </ui:composition>
</html>
